<template>
	<view class="box">
		<view class="header">
			人脸核验
		</view>
		<view class="contenter">

			<view class="middle">
				<image :src="imgSrc" />
			</view>
			<ll-face-detect ref="faceDetect" @detectFailed="detectFailed" @photoChange="photoChange"
				@detectOver="detectOver" />
			<button type="primary" @click="init">开始录入</button>
		</view>
	</view>
</template>

<script>
	import context from '../../lib/java110/Java110Context.js';
	const constant = context.constant;
	import llFaceDetect from '@/components/ll-face-detect/ll-face-detect'
	export default {
		components: {
			llFaceDetect
		},
		data() {
			return {
				plotCommunityId: '',
				imgSrc: '../../static/authSucceed.png',
				userId:'',
			}
		},
		onLoad() {

		},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			let _plotNum = uni.getStorageSync("_selectCommunity");
			let userIdInfo = uni.getStorageSync("userInfo");
			this.userId = userIdInfo.id;
			// this.plotNum = _plotNum.communityName + "小区";

			if (_plotNum != null && _plotNum != undefined && _plotNum != '') {
				this.plotNum = _plotNum.communityName + "小区";
				this.plotCommunityId = _plotNum.id; //小区id
				console.log("小区ID", this.plotCommunityId)
			}
		},
		methods: {
			init() {
				this.$refs.faceDetect.initData()
			},

			//人脸核验提交成功执行 
			detectOver() {
				uni.showToast({
					title: "人脸核验流程结束~",
					icon: 'none'
				})
			},
			// 人脸核验完成
			photoChange(path) {
				this.imgSrc = path
				// let param = new FormData(); //创建form对象
				// param.append("file", file, path); //通过append向form对象添加数据
				// param.append("chunk", "0"); //添加form表单中其他数据
				// this.$refs.faceDetect.detectOver()
				// 上传图片操作
				uni.uploadFile({
					method: 'POST',
					url: constant.url.faceUpload,
					name: 'file',
					filePath: this.imgSrc,
					header: context.getHeaders(),
					formData: {
						user: 'test'
					},
					success: (response) => {
						console.log("上传成功")
						let jsondata = JSON.parse(response.data);
						let urldata = jsondata.url
						// this.$refs.faceDetect.detectOver()
						uni.request({
							method: 'POST',
							url: constant.url.peopleFace,
							header: context.getHeaders(),
							data: {
								headUrl: urldata,
								userId:this.userId,
								communityId: this.plotCommunityId,
							},
							success: (res) => {
								let dataNumCount = res.data
								if(dataNumCount.code == 0){
									this.$refs.faceDetect.detectOver()
								}
							},
							fail: (error) => {
								console.log("失败")
							}
						})
					},
					fail: (error) => {

					}
				})
			},
			// 人脸核验相机执行失败
			detectFailed() {
				uni.showToast({
					title: "人脸核验失败~",
					icon: 'none'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 100%;
		height: 100vh;
		background-color: #264272;

		.header {
			height: 100rpx;
			line-height: 100rpx;
			padding-left: 20rpx;
			font-size: 26rpx;
			color: white;
		}

		.contenter {
			width: 100%;
			margin-top: 100rpx;
			height: 500rpx;

			.middle {
				width: 500rpx;
				height: 500rpx;
				margin: auto;

				image {
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}

			button {
				width: 600rpx;
				height: 100rpx;
				border-radius: 60rpx;
				text-align: center;
				line-height: 100rpx;
				margin: 200rpx auto 0rpx auto;
			}
		}
	}
</style>
